<template>
  <view class="message-board">
    <u-list>
      <u-list-item v-for="message in messages" :key="message.id"> 
        <u-card :title="message.sender"  :sub-title="message.time"> 
          <view slot="body">
            <text>{{message.content}}</text> 
          </view>
          <view slot="foot">
            <u-button size="mini" @click="$emit('reply', message)" 
                      :disabled="message.replied"> 
              {{message.replied  ? '已回复' : '回复'}}
            </u-button>
          </view>
        </u-card>
      </u-list-item>
    </u-list>
  </view>
</template>